<template>
    <div class="changecoursesdetail">
        <h2 class="navd">换课详情</h2>
        <h2 class="backchangecourses" @click="backchangecourses">返回</h2>
        <div class="changedetailbox">
            <el-row class="row_1">
                <el-col class="col_1" :span="12">
                    <h3>申请老师:</h3>
                    <p>{{ formData.oldTeaName }}</p>
                </el-col>
                <el-col class="col_1" :span="12">
                    <h3>指向老师:</h3>
                    <p>{{ formData.newTeaName }}</p>
                </el-col>
            </el-row>
            <el-row class="row_1">
                <el-col class="col_1" :span="12">
                    <h3>申请课程:</h3>
                    <p>{{ formData.oldSubName }}</p>
                </el-col>
                <el-col class="col_1" :span="12">
                    <h3>指向课程:</h3>
                    <p>{{ formData.newSubName }}</p>
                </el-col>
            </el-row>
            <el-row class="row_1">
                <el-col class="col_1" :span="12">
                    <h3>申请班级:</h3>
                    <p>{{ formData.oldClazzName }}</p>
                </el-col>
                <el-col class="col_1" :span="12">
                    <h3>指向班级:</h3>
                    <p>{{ formData.newClazzName }}</p>
                </el-col>
            </el-row>
            <el-row class="row_1">
                <el-col class="col_1" :span="12">
                    <h3>原上课时间:</h3>
                    <p>{{ formData.oldTime }}</p>
                </el-col>
                <el-col class="col_1" :span="12">
                    <h3>换课时间:</h3>
                    <p>{{ formData.newTime }}</p>
                </el-col>
            </el-row>
            <el-row class="row_1">
                <el-col class="col_1" :span="12">
                    <h3>申请日期:</h3>
                    <p>{{ formData.createTime }}</p>
                </el-col>
                <el-col class="col_1" :span="12">
                    <h3>审&nbsp;&nbsp;批&nbsp;&nbsp;人:</h3>
                    <p>{{ formData.userName }}</p>
                </el-col>
            </el-row>
            <el-row class="row_1">
                <el-col class="col_1" :span="12">
                    <h3>审批状态:</h3>
                    <p>{{ formData.sname }}</p>
                </el-col>
            </el-row>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            formData: {
                oldTeaName: "",
                newTeaName: "",
                oldSubName: "",
                newSubName: "",
                oldClazzName: "",
                newClazzName: "",
                oldTime: "",
                newTime: "",
                createTime: "",
                userName: "",
                sname: ""
            },
            baseUrl: require("../js/baseUrl.js").baseUrl,
            chaId: 0,
        }
    },
    methods: {
        backchangecourses() {//返回上一级
            this.$router.push("/coursemanager/changecourse/changecourses")
        },
        //查看换课信息
        lookchangedetail() {
            this.$http.post(this.baseUrl + "SchoolSys/cha/ChaInfoByID", {
                cId: Number(this.chaId)
            }).then(res => {
                //console.log("换课详情", res);
                if(res.data.code==200){
                    this.formData = res.data.data
                let createTime = res.data.data.createTime + ""
                this.formData.createTime = createTime.substring(0, 10)
                }else{
                    this.$message.error(res.data.msg)
                }

            })
        },
    },
    mounted() {
        this.chaId = this.$route.query.changecourseinfoid
        this.lookchangedetail();
    }
}
</script>

<style lang="less">
.changecoursesdetail {
    position: relative;
    padding: 40px;
    height: 40px;
    line-height: 40px;

    .navd {
        text-decoration: none;
        color: #000;
        font-weight: 900;
    }

    .changedetailbox {

        margin-top: 30px;
    }

    .changedetailbox h3 {
        width: 100px;
        height: 30px;
        line-height: 10px;
    }

    .changedetailbox p {
        width: 320px;
        margin-left: 10px;
        margin-bottom: 19px;
        line-height: 40px;
        border: 1px solid #999;
        background-color: #ffffff;
        padding-left: 10px;
    }

    .changedetailbox .row_1 .col_1 {
        display: flex;
        align-items: center;
    }

    .backchangecourses {
        position: absolute;
        right: 50px;
        top: 30px;
        color: #000;
    }
}

</style>